<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="120px">
      <el-form-item label="店铺编号" prop="storeCode">
        <el-input v-model="queryParams.storeCode" placeholder="请输入店铺编号" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="店铺名称" prop="storeName">
        <el-input v-model="queryParams.storeName" placeholder="请输入店铺名称" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="入驻家乡" prop="keyword">
        <el-input v-model="queryParams.keyword" placeholder="请输入入驻家乡" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="入驻类型" prop="storeMold">
        <el-select v-model="queryParams.storeMold" placeholder="请选择入驻类型" clearable>
          <el-option v-for="dict in storeMoldList" :key="dict.value" :label="dict.label" :value="dict.value" />
        </el-select>
      </el-form-item>
      <el-form-item label="法人姓名" prop="legalName">
        <el-input v-model="queryParams.legalName" placeholder="请输入法人姓名" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="法人联系方式" prop="personPhone">
        <el-input v-model="queryParams.personPhone" placeholder="请输入法人联系方式" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <!-- <el-form-item label="审核状态" prop="storeStatus">
        <el-select v-model="queryParams.storeStatus" placeholder="请选择审核状态" clearable>
          <el-option v-for="dict in storeStatus" :key="dict.value" :label="dict.label" :value="dict.value" />
        </el-select>
      </el-form-item> -->
      <el-form-item label="创建时间">
        <el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange"
          range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <!-- <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
          v-hasPermi="['store:onlinestore:add']">新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
          v-hasPermi="['store:onlinestore:edit']">修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
          v-hasPermi="['store:onlinestore:remove']">删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
          v-hasPermi="['store:onlinestore:export']">导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row> -->
    <el-table v-loading="loading" :data="onlinestoreList" @selection-change="handleSelectionChange"
      :max-height="tableHeight()">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="店铺编号" align="center" prop="storeCode" />
      <el-table-column label="店铺名称" align="center" prop="storeName" />
      <!-- 入驻家乡 -->
      <el-table-column label="入驻家乡" align="center" prop="fullVillage" />
      <el-table-column label="商品类目" align="center" prop="businessScope" />
      <el-table-column label="保证金" align="center" prop="cashDeposit" />
      <!-- 保证金凭证 -->
      <el-table-column label="保证金凭证" align="left" prop="cashDeposit" width="120">
        <template slot-scope="scope">
          <div v-if="scope.row.list.length>0" style="display: flex;">
            <div style="width: 100px;height: 100px;">
              <el-image style="width: 100px; height: 100px" :src="scope.row.list[0]" :preview-src-list="scope.row.list"
                fit="contain"></el-image>
            </div>
          </div>
        </template>
      </el-table-column>
      <el-table-column width="155" label="快递费" align="center" prop="expressFee">
        <template slot-scope="scope">
           <div style="color: #f56c6c;">
            <span>{{scope.row.expressFee}}</span>
            <span @click="viewMore(scope.row)" style="color: green;margin-left: 10px;cursor: pointer;color:#1890ff">查看更多</span>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="入驻类型" align="center" prop="storeType">
        <template slot-scope="scope">
          <el-tag v-if="scope.row.storeMold=='0'" type="info">个体商户</el-tag>
          <el-tag v-else-if="scope.row.storeMold=='1'">企业商户</el-tag>
          <el-tag v-else type="warning">全部</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="法人姓名" align="center" prop="legalName" />
      <el-table-column label="法人联系方式" align="center" prop="personPhone" />
      <!-- 入驻时间 -->
      <el-table-column label="入驻时间" align="center" prop="auditPassTime" />
      <el-table-column label="客服电话" align="center" prop="customerPhone" />
      <!-- 客服链接 -->
      <el-table-column label="客服链接" align="center" prop="customerUrl" />
      <!-- 商品数量 -->
      <el-table-column label="商品SKU" align="center" prop="skuCount" />
      <el-table-column label="操作" fixed="right" width="300" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" style="margin-right: 10px;" icon="el-icon-edit"
            @click="handleUpdate(scope.row)">查看</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleOpenAccount(scope.row)">登录账号</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleBzj(scope.row)">设置保证金</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleLink(scope.row)">客服链接</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleEdit(scope.row)">编辑</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="expressFeeEdit(scope.row)">快递费</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />
    <!-- 添加或修改店铺对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="1200px" @close="cancel" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="150px">
        <div style="color: red;font-size: 15px;font-weight: 500">法人信息</div>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="法人姓名" prop="legalName">
              <el-input :disabled="true" v-model="form.legalName" placeholder="法人姓名" />
            </el-form-item>
            <el-form-item label="法人联系方式" prop="personPhone">
              <el-input :disabled="true" v-model="form.personPhone" placeholder="法人联系方式" />
            </el-form-item>
            <el-form-item label="法人邮箱" prop="legalEmail">
              <el-input :disabled="true" v-model="form.legalEmail" placeholder="法人邮箱" />
            </el-form-item>
            <el-form-item label="证件类型" prop="storeCode">
              <el-input :disabled="true" v-model="card" placeholder="证件类型" />
            </el-form-item>
            <el-form-item label="法人身份证号码" prop="legalPersonId">
              <el-input :disabled="true" v-model="form.legalPersonId" placeholder="法人身份证号码" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="身份证有效期" prop="legalPersonPicFront">
              <el-input style="margin-bottom: 10px;" :disabled="true" v-model="form.cardBeginTime"
                placeholder="法人身份证号码" />
              <el-input :disabled="true" v-model="form.cardEndTime" placeholder="法人身份证号码" />
            </el-form-item>
            <el-form-item label="身份证正面" prop="legalPersonPicFront">
              <el-image style="width: 200px; height: 100px" :src="form.legalPersonPicFront"
                :preview-src-list="[form.legalPersonPicFront]" fit="contain"></el-image>
            </el-form-item>
            <el-form-item label="身份证反面" prop="legalPersonPicReverse">
              <el-image style="width: 200px; height: 100px" :src="form.legalPersonPicReverse"
                :preview-src-list="[form.legalPersonPicReverse]" fit="contain"></el-image>
            </el-form-item>
          </el-col>
        </el-row>

        <div style="color: red;font-size: 15px;font-weight: 500">店铺资质</div>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="营业执照名称" prop="businessName">
              <el-input :disabled="true" v-model="form.businessName" placeholder="营业执照名称" />
            </el-form-item>
            <el-form-item label="营业执照编号" prop="businessLicense">
              <el-input :disabled="true" v-model="form.businessLicense" placeholder="营业执照编号" />
            </el-form-item>
            <el-form-item label="营业执照归属地" prop="businessEncoding">
              {{licenseOwner.provinceName}}，{{licenseOwner.cityName}}，{{licenseOwner.counryName}}
            </el-form-item>
            <el-form-item label="营业执照有效期" prop="businessBeginTime">
              <el-input :disabled="true" style="margin-bottom: 10px;" v-model="form.businessBeginTime"
                placeholder="营业执照有效期" />
              <el-input :disabled="true" v-model="form.businessEndTime" placeholder="营业执照有效期" />
            </el-form-item>
            <el-form-item label="营业执照住所" prop="businessAddress">
              <el-input :disabled="true" v-model="form.businessAddress" placeholder="营业执照住所" />
            </el-form-item>
            <el-form-item label="营业执照" prop="businessLicensePic">
              <el-image style="width: 200px; height: 100px" :src="form.businessLicensePic"
                :preview-src-list="[form.businessLicensePic]" fit="contain"></el-image>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="店铺门头照片" prop="storeHeadUrl">
              <el-image v-if="form.storeHeadUrl" style="width: 200px; height: 100px" :src="form.storeHeadUrl"
                :preview-src-list="[form.storeHeadUrl]" fit="contain"></el-image>
            </el-form-item>
            <el-form-item label="店铺经营场所照片" prop="storeManageUrl">
              <el-image v-if="form.storeManageUrl" style="width: 200px; height: 100px" :src="form.storeManageUrl"
                :preview-src-list="[form.storeManageUrl]" fit="contain"></el-image>
            </el-form-item>
            <el-form-item label="商户收银台照片" prop="storePayUrl">
              <el-image v-if="form.storePayUrl" style="width: 200px; height: 100px" :src="form.storePayUrl"
                :preview-src-list="[form.storePayUrl]" fit="contain"></el-image>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 审核状态 -->
        <el-row>
          <el-col :span="24">
            <el-form-item label="审核状态" prop="busFlag">
              <el-select disabled v-model="form.busFlag" placeholder="请选择">
                <el-option v-for="dict in dict.type.store_info_exam" :key="dict.value" :label="dict.label"
                  :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <div style="color: red;font-size: 15px;font-weight: 500">结算信息</div>
        <el-row :gutter="20">
          <el-col :span="12">
            <!-- 个人 ：法人 legalName   0 -->
            <!-- 企业：营业执照 businessName  1 -->
            <el-form-item v-if="form.storeMold==='0'" label="账号名称" prop="legalName">
              <el-input :disabled="true" v-model="form.legalName" placeholder="账号名称" />
            </el-form-item>
            <el-form-item v-if="form.storeMold==='1'" label="账号名称" prop="businessName">
              <el-input :disabled="true" v-model="form.businessName" placeholder="账号名称" />
            </el-form-item>

            <el-form-item label="银行卡号" prop="corporateAccount">
              <el-input :disabled="true" v-model="form.corporateAccount" placeholder="银行卡号" />
            </el-form-item>
            <el-form-item label="预留手机号" prop="corporatePhone">
              <el-input :disabled="true" v-model="form.corporatePhone" placeholder="预留手机号" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支行名称" prop="bankName">
              <el-input :disabled="true" v-model="form.bankName" placeholder="支行名称" />
            </el-form-item>
            <el-form-item label="开户支行联行号" prop="branchNumb">
              <el-input :disabled="true" v-model="form.branchNumb" placeholder="开户支行联行号" />
            </el-form-item>
            <el-form-item v-if="form.storeMold==='0'" label="账户类型" prop="legalName">
              <el-input :disabled="true" v-model="accountPrivateType" placeholder="账户类型" />
            </el-form-item>
            <el-form-item v-if="form.storeMold==='1'" label="账户类型" prop="businessName">
              <el-input :disabled="true" v-model="accountType" placeholder="账户类型" />
            </el-form-item>
            <!-- 开户许可证 -->
            <el-form-item v-if="form.storeMold==='1'" label="开户许可证" prop="openingPermitPic">
              <el-image v-if="form.openingPermitPic" style="width: 200px; height: 100px" :src="form.openingPermitPic"
                :preview-src-list="[form.openingPermitPic]" fit="contain"></el-image>
            </el-form-item>
            <el-form-item v-if="form.storeMold==='0'" label="结算银行卡正面" prop="bankRightUrl">
              <el-image v-if="form.bankRightUrl" style="width: 200px; height: 100px" :src="form.bankRightUrl"
                :preview-src-list="[form.bankRightUrl]" fit="contain"></el-image>
            </el-form-item>
            <el-form-item v-if="form.storeMold==='0'" label="结算银行卡反面" prop="bankReverseUrl">
              <el-image v-if="form.bankReverseUrl" style="width: 200px; height: 100px" :src="form.bankReverseUrl"
                :preview-src-list="[form.bankReverseUrl]" fit="contain"></el-image>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 审核状态 -->
        <el-row>
          <el-col :span="24">
            <el-form-item label="审核状态" prop="bankFlag">
              <el-select disabled v-model="form.bankFlag" placeholder="请选择">
                <el-option v-for="dict in dict.type.store_info_exam" :key="dict.value" :label="dict.label"
                  :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="审核备注" prop="infoRemark">
              <el-input style="margin-bottom: 10px;" :disabled="true" v-model="form.infoRemark" placeholder="" />
            </el-form-item>
          </el-col>
        </el-row>
        <div style="color: red;font-size: 15px;font-weight: 500">店铺信息</div>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="店铺头像" prop="storeUrl">
              <el-image style="width: 200px; height: 100px" :src="form.storeUrl" :preview-src-list="[form.storeUrl]"
                fit="contain"></el-image>
            </el-form-item>
            <el-form-item label="店铺名称" prop="storeName">
              <el-input :disabled="true" v-model="form.storeName" placeholder="请输入店铺名称" />
            </el-form-item>
            <el-form-item label="客服电话" prop="customerPhone">
              <el-input :disabled="true" v-model="form.customerPhone" placeholder="请输入客服电话" />
            </el-form-item>
            <el-form-item label="商品类目" prop="businessScope">
              <el-input :disabled="true" v-model="form.businessScope" placeholder="商品类目" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="入驻家乡" prop="classes" style="width: 100%;">
              <el-cascader style="margin-bottom: 10px;width: 100%;" :disabled="true" v-model="form.county"
                :options="addressXz" :props="propsObj"></el-cascader>
              <el-input :disabled="true" v-model="form.village" placeholder="入驻家乡" />
            </el-form-item>
            <el-form-item label="商标证书/商标授权书/品牌授权书" prop="securityUrl">
              <el-image v-if="form.securityUrl" style="width: 200px; height: 100px" :src="form.securityUrl"
                :preview-src-list="[form.securityUrl]" fit="contain"></el-image>
            </el-form-item>
            <el-form-item label="食品经营安全许可证" prop="trademarkUrl">
              <el-image v-if="form.trademarkUrl" style="width: 200px; height: 100px" :src="form.trademarkUrl"
                :preview-src-list="[form.trademarkUrl]" fit="contain"></el-image>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="viewReview=='2'">
          <el-col :span="24">
            <el-form-item label="审核状态" prop="storeFlag">
              <el-select v-model="form.storeFlag" placeholder="请选择">
                <el-option v-for="dict in dict.type.store_info_exam" :key="dict.value" :label="dict.label"
                  :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item v-if="form.storeFlag=='2'" label="审核备注" prop="storeRemarks">
              <el-input type="textarea" v-model="form.storeRemarks" placeholder="请输入" />
            </el-form-item>
            <div style="line-height: 18px;padding-top: 10px;margin-left: 150px;">在发现申请中哪一类 有一项不符合要求，备注清楚告知商家具体的错误原因及所在项。
            </div>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer" style="text-align: center;">
        <el-button v-if="viewReview=='2'" @click="audit('form')">审 核</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <el-dialog title="登录账号" :visible.sync="merchantAccountDialogVisible" @close="merchantAccountDialogCancel"
      width="30%">
      <el-form :model="merchantAccountForm" :rules="merchantAccountRuleFormRules" ref="merchantAccountForm"
        label-width="100px" class="demo-ruleForm">
        <el-form-item label="用户昵称" prop="nickName">
          <el-select @change="changeAccount" v-model="merchantAccountForm.sysUserId" placeholder="请选择">
            <el-option v-for="dict in systemList" :key="dict.userId" :label="dict.nickName"
              :value="dict.userId"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="用户账号">
          {{merchantAccountForm.loginUser}}
        </el-form-item>
        <el-form-item label="用户密码">
          <div style="font-size: 20px">******</div>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="merchantAccountSubmitForm('merchantAccountForm')">确定</el-button>
          <el-button @click="merchantAccountResetForm('merchantAccountForm')">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!-- dialogBzjCancel -->
    <el-dialog title="设置保证金" :visible.sync="dialogBzjVisible" @close="dialogBzj" width="50%">
      <el-form :model="merchintBzjForm" :rules="merchintBzjFormRules" ref="merchantBzjForm" label-width="100px"
        class="demo-ruleForm">
        <el-form-item label="到账金额" prop="cashDeposit">
          <el-input type="text" v-model="merchintBzjForm.cashDeposit"></el-input>
        </el-form-item>
        <el-form-item>
          <span slot="label"><span style="color: #f56c6c;font-size: 14px;">*</span>上传凭证</span>
          <el-upload style="width: 300px;" :limit="4" multiple :action="uploadUrl" :headers="headers"
            list-type="picture" :on-preview="handlePictureCardPreviewDetails" :on-remove="handleRemoveDetails"
            :on-success="handleSuccessDetails" :file-list="productPicList">
            <el-button :disabled="productPicList && productPicList.length>3 ? true : false" size="small"
              type="primary">点击上传</el-button>
          </el-upload>
          <div style="color: #ff4949;font-size: 12px;" v-if="productPicList.length===0">请上传凭证</div>
        </el-form-item>
        <el-form-item label="历史凭证">
          <div style="display: flex;flex-wrap: wrap;">
            <div v-for="(item,index) in oldpicList" :key="index">
              <el-image style="width: 200px; height: 100px" :preview-src-list="oldpicList" :src="item"
                fit="contain"></el-image>
            </div>
          </div>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="bzjSubmitForm('merchantBzjForm')">确定</el-button>
          <el-button @click="dialogBzj">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--  -->
    <el-dialog title="店铺客服" :visible.sync="dialogCustomerVisible" @close="dialogCustomer" width="30%">
      <el-form :model="kfForm" :rules="kfFormRules" ref="kfForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label="店铺名称" prop="storeName">
          {{kfForm.storeName}}
        </el-form-item>
        <el-form-item label="客服链接" prop="customerUrl">
          <el-input type="textarea" v-model="kfForm.customerUrl"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="customSubmitForm('kfForm')">确定</el-button>
          <el-button @click="dialogCustomer">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- <el-dialog title="店铺信息" :visible.sync="dialogCustomerVisible" @close="dialogCustomer" width="30%">
      <el-form :model="kfForm" :rules="kfFormRules" ref="kfForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label="店铺名称" prop="storeName">
          {{kfForm.storeName}}
        </el-form-item>
        <el-form-item label="客服链接" prop="customerUrl">
          <el-input type="textarea" v-model="kfForm.customerUrl"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="customSubmitForm('kfForm')">确定</el-button>
          <el-button @click="dialogCustomer">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog> -->

    <el-dialog title="店铺信息" :visible.sync="storeInfoVisible" @close="dialogStoreInfo" width="60%">
      <el-form :model="storeInfoForm" :rules="storeInfoRules" ref="storeInfoForm" label-width="240px"
        class="demo-ruleForm">
        <el-form-item label="店铺头像" prop="storeUrl">
          <el-upload style="width: 300px;" :limit="1" multiple :action="uploadUrl" :headers="headers"
            list-type="picture" :on-preview="storeAvatorPreview" :on-remove="storeAvatorRemove"
            :on-success="storeAvatorSuccess" :file-list="storeAvatorPreviewList">
            <el-button :disabled="storeAvatorPreviewList && storeAvatorPreviewList.length>0 ? true : false" size="small"
              type="primary">点击上传</el-button>
          </el-upload>
        </el-form-item>
        <el-form-item label="店铺名称" prop="storeName">
          <el-input v-model="storeInfoForm.storeName" placeholder="请输入店铺名称" />
        </el-form-item>
        <el-form-item label="客服电话" prop="customerPhone">
          <el-input v-model="storeInfoForm.customerPhone" placeholder="请输入客服电话" />
        </el-form-item>
        <el-form-item label="商品类目" prop="businessScope">
          <el-input v-model="storeInfoForm.businessScope" placeholder="商品类目" />
        </el-form-item>
        <el-form-item label="入驻家乡" prop="village" style="width: 100%;">
          <el-cascader style="margin-bottom: 10px;width:100%;" v-model="storeInfoForm.county" :options="addressXz"
            :props="propsObj" @change="backHandleChange"></el-cascader>
          <el-input v-model="storeInfoForm.village" placeholder="入驻家乡" />
        </el-form-item>
        <el-form-item class="fold_label" label="商标证书/商标授权书/品牌授权书" prop="productManUrl">
          <el-upload style="width: 300px;" :limit="4" multiple :action="uploadUrl" :headers="headers"
            list-type="picture" :on-preview="tradePreview" :on-remove="tradeRemove" :on-success="tradeSuccess"
            :file-list="tradePreviewList">
            <el-button size="small" type="primary">点击上传</el-button>
          </el-upload>

          <div style="display: flex;flex-wrap: wrap;">
            <div v-for="(item,index) in storeInfoForm.trademarkUrlListNew" :key="index">
              <el-image v-if="item" style="width: 200px; height: 100px"
                :preview-src-list="storeInfoForm.trademarkUrlListNew" :src="item" fit="contain"></el-image>
            </div>
          </div>
        </el-form-item>
        <el-form-item class="fold_label" label="食品经营安全许可证" prop="trademarkUrl">
          <el-upload style="width: 300px;" :limit="4" multiple :action="uploadUrl" :headers="headers"
            list-type="picture" :on-preview="foodPreview" :on-remove="foodRemove" :on-success="foodSuccess"
            :file-list="foodPreviewList">
            <el-button size="small" type="primary">点击上传</el-button>
          </el-upload>
          <div style="display: flex;flex-wrap: wrap;">
            <div v-for="(item,index) in storeInfoForm.securityUrlListNew" :key="index">
              <el-image v-if="item" style="width: 200px; height: 100px"
                :preview-src-list="storeInfoForm.securityUrlListNew" :src="item" fit="contain"></el-image>
            </div>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer" style="text-align: center;">
        <el-button type="primary" @click="storeInfoAudit('storeInfoForm')">提交</el-button>
        <el-button @click="dialogStoreInfo">取 消</el-button>
      </div>
    </el-dialog>


    <!-- 快递费 -->
    <el-dialog title="快递费" :visible.sync="dialogKdfVisible" @close="dialogBzj" width="50%">
      <el-form :model="kdfForm" :rules="kdfFormRules" ref="kdfForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label="到账金额" prop="expressFee">
          <el-input type="text" v-model="kdfForm.expressFee"></el-input>
        </el-form-item>
        <el-form-item>
          <span slot="label"><span style="color: #f56c6c;font-size: 14px;">*</span>上传凭证</span>
          <el-upload style="width: 300px;" :limit="4" multiple :action="uploadUrl" :headers="headers"
            list-type="picture" :on-preview="handlekdfPictureCardPreviewDetails" :on-remove="handlekdfRemoveDetails"
            :on-success="handlekdfSuccessDetails" :file-list="productPicKdfList">
            <el-button :disabled="productPicKdfList && productPicKdfList.length>3 ? true : false" size="small"
              type="primary">点击上传</el-button>
          </el-upload>
          <div style="color: #ff4949;font-size: 12px;" v-if="productPicKdfList.length===0">请上传凭证</div>
        </el-form-item>
        <el-form-item label="历史凭证">
          <div style="display: flex;flex-wrap: wrap;">
            <div v-for="(item,index) in oldKdfPicList" :key="index">
              <el-image style="width: 200px; height: 100px" :preview-src-list="oldKdfPicList" :src="item"
                fit="contain"></el-image>
            </div>
          </div>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input type="text" v-model="kdfForm.remark"></el-input>
        </el-form-item>
        <el-form-item></el-form-item>
        <el-form-item>
          <el-button type="primary" @click="kdfSubmitForm('kdfForm')">确定</el-button>
          <el-button @click="dialogKdf">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
  import {
    getOnlinestore,
    getSystemUserList,
    applicationCityCd,
  } from "@/api/store/onlinestore";
  import {
    uploadImages,
    getOrderAddress,
    fileDeleteOss,
    getSystemListUser,
  } from "@/api/system/user";
  import {
    getOnlinestoreStoreList,
    getUpdCashDeposit,
    getUpdCustomerUrl,
    getUpdUserAcctNo,
    getUpdHtOnlineStore,
    getUpdExpressFee,
    getExpressFeeLogList
  } from "@/api/store/storemanage";
  import {
    getToken
  } from "@/utils/auth";

  export default {
    name: "Onlinestore",
    dicts: ['store_type', 'store_info_exam', 'store_exam_flag'],
    data() {
      return {
        card: '身份证',
        // 账户类型
        accountPrivateType: '对私',
        accountType: '对公',
        // 对公 对私
        accountList: [],
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 店铺表格数据
        onlinestoreList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        dialogVisible: false,
        merchantAccountDialogVisible: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          storeCode: null,
          storeName: null,
          keyword: null,
          storeMold: null,
          legalName: null,
          personPhone: null,
          //   storeStatus: null,
        },
        // 表单参数
        form: {},
        // 表单校验
        rules: {},
        xlsFile: [],
        fileListN: [],
        listNew: [],
        xlsFile1: [],
        fileListN1: [],
        listNew1: [],
        addressXz: [],
        value: [],
        propsObj: {
          label: 'text',
          value: 'value',
          option: 'children',
        },
        merchintForm: {
          storeName: null,
          busFlag: null,
          storeFlag: null,
          bankFlag: null,
          storeRemarks: null,
          infoRemark: null
        },
        merchintFormRules: {
          storeName: [{
            required: true,
            message: '请输入',
            trigger: 'blur'
          }, ],
          busFlag: [{
            required: true,
            message: '请选择',
            trigger: 'change'
          }],
          storeFlag: [{
            required: true,
            message: '请选择',
            trigger: 'change'
          }],
          bankFlag: [{
            required: true,
            message: '请选择',
            trigger: 'change'
          }],
          storeRemarks: [{
            required: true,
            message: '请选择',
            trigger: 'change'
          }],
        },
        merchantAccountForm: {
          sysUserId: null,
          loginUser: null,
        },
        merchantAccountRuleFormRules: {
          account: [{
            required: true,
            message: '请输入登录账号',
            trigger: 'blur'
          }, ],
          password: [{
            required: true,
            message: '请输入登录密码',
            trigger: 'blur'
          }],
        },
        accountChoosedData: {

        },
        licenseOwner: {
          provinceList: [],
          cityList: [],
          countyList: [],
          provinceName: '',
          cityName: '',
          counryName: '',
        },
        propsObj: {
          label: 'text',
          value: 'value',
          option: 'children',
        },
        systemList: [],
        // 保证金
        merchintBzjForm: {},
        merchintBzjFormRules: {
          cashDeposit: [{
            required: true,
            message: '请输入到账金额',
            trigger: ["blur", "change"]
          }]
        },
        // 快递费
        kdfForm: {},
        kdfFormRules: {
          expressFee: [{
            required: true,
            message: '请输入快递费',
            trigger: ["blur", "change"]
          }]
        },
        dialogBzjVisible: false,
        dialogKdfVisible: false,
        uploadUrl: process.env.VUE_APP_BASE_API + "/file/upload/oss", // 上传的图片服务器地址
        headers: {
          Authorization: "Bearer " + getToken()
        },
        productPicList: [],
        productPicKdfList: [],
        viewReview: '',
        storeStatus: [{
            label: '审核中',
            value: '0'
          },
          {
            label: '营业',
            value: '1'
          },
          {
            label: '闭店',
            value: '2'
          },
          {
            label: '审核失败',
            value: '3'
          },
          {
            label: '缴纳保证金',
            value: '4'
          },
          {
            label: '审核完成',
            value: '5'
          },
          {
            label: '保证金到账',
            value: '6'
          },
        ],
        dateRange: [],
        storeMoldList: [{
            label: '全部',
            value: ''
          }, {
            label: '个体商户',
            value: '0'
          },
          {
            label: '企业商户',
            value: '1'
          },
        ],
        oldpicList: [],
        oldKdfPicList: [],
        dialogCustomerVisible: false,
        kfForm: {},
        kfFormRules: {
          customerUrl: [{
            required: true,
            message: '请输入客服链接',
            trigger: ["blur", "change"]
          }]
        },
        storeInfoVisible: false,
        storeInfoForm: {},
        storeInfoRules: {
          storeName: [{
            required: true,
            message: '请输入店铺名称',
            trigger: ["blur", "change"]
          }],
          customerPhone: [{
            required: true,
            message: '请输入客服电话',
            trigger: ["blur", "change"]
          }],
          businessScope: [{
            required: true,
            message: '请输入商品类目',
            trigger: ["blur", "change"]
          }],
          village: [{
            required: true,
            message: '请输入入驻家乡',
            trigger: ["blur", "change"]
          }]
        },
        tradePreviewList: [],
        foodPreviewList: [],
        storeAvatorPreviewList: []
      };
    },
    created() {
      this.getList();
      this.getOrderAddress();
      this.getSystemUserList()
      this.getProvinceLinked('', '1', '1')
      this.getListUser()
    },
    methods: {
      backHandleChange(value) {
        this.storeInfoForm.province = value[0]
        this.storeInfoForm.city = value[1]
        this.storeInfoForm.county = value[2]
        console.log(value);
      },
      tableHeight() {
        return document.body.clientHeight - 280;
      },
      // 修改
      storeInfoAudit(formName) {
        var imageParams = this.tradePreviewList.map(v => v.response.data[0].url)
        var imageStr = ''
        if (imageParams.length > 0) {
          imageStr = imageParams.join(',')
        }

        var foodimageParams = this.foodPreviewList.map(v => v.response.data[0].url)
        var foodimageStr = ''
        if (foodimageParams.length > 0) {
          foodimageStr = foodimageParams.join(',')
        }
        let params = {
          "storeCode": this.storeInfoForm.storeCode,
          "storeName": this.storeInfoForm.storeName,
          "storeUrl": this.storeInfoForm.storeUrl,
          "customerPhone": this.storeInfoForm.customerPhone,
          "businessScope": this.storeInfoForm.businessScope,
          "province": this.storeInfoForm.province,
          "city": this.storeInfoForm.city,
          "county": this.storeInfoForm.county,
          "village": this.storeInfoForm.village,
          "trademarkUrl": imageStr, //商标证书
          "securityUrl": foodimageStr //视频安全证书
        }
        this.$refs[formName].validate((valid) => {
          if (valid) {
            getUpdHtOnlineStore(params).then(response => {
              this.storeInfoVisible = false;
              this.getList();
            });
          } else {
            return false;
          }
        });
      },
      // 设置客服
      customSubmitForm(formName) {
        let params = {
          "storeCode": this.kfForm.storeCode,
          "customerUrl": this.kfForm.customerUrl,
        }
        this.$refs[formName].validate((valid) => {
          if (valid) {
            getUpdCustomerUrl(params).then(response => {
              this.dialogCustomerVisible = false;
              this.getList();
            });
          } else {
            return false;
          }
        });
      },
      dialogCustomer() {
        this.dialogCustomerVisible = false;
      },
      handleEdit(row) {
        this.storeAvatorPreviewList = []
        this.storeInfoForm = {}
        this.storeInfoForm = JSON.parse(JSON.stringify(row));
        this.storeInfoVisible = true

        this.storeAvatorPreviewList.push({
          url: this.storeInfoForm.storeUrl
        })
        this.storeInfoForm.trademarkUrlList = [...this.storeInfoForm.trademarkUrlList, this.storeInfoForm.securityUrl]
        let str = this.storeInfoForm.trademarkUrlList.join(',')
        let list = []
        if (str.length > 0) {
          list = str.split(',')
        }
        this.storeInfoForm.trademarkUrlListNew = list
        this.storeInfoForm.securityUrlList = [...this.storeInfoForm.securityUrlList, this.storeInfoForm.trademarkUrl]
        let str1 = this.storeInfoForm.securityUrlList.join(',')
        let list1 = []
        if (str1.length > 0) {
          list1 = str1.split(',')
        }
        this.storeInfoForm.securityUrlListNew = list1

        this.storeInfoForm.provinceCityCountry = [this.storeInfoForm.province, this.storeInfoForm.city, this
          .storeInfoForm.county
        ]
      },
      dialogStoreInfo() {
        this.storeInfoVisible = false
      },
      // 审核
      audit(formName) {
        let storeStatusNew = ''
        let storeStatus = this.form.storeStatus
        if (storeStatus === '0') {
          if (this.form.busFlag == '1' && this.form.storeFlag == '1' && this.form.bankFlag ==
            '1') {
            storeStatusNew = '4'
          } else {
            storeStatusNew = '3'
          }
        }

        let params = {
          "storeCode": this.form.storeCode,
          "storeStatus": storeStatusNew,
          "storeRemarks": this.form.storeRemarks,
          "storeFlag": this.form.storeFlag
        }
        this.$refs[formName].validate((valid) => {
          if (valid) {
            depositConfirmAudit(params).then(response => {
              this.open = false;
              this.getList();
            });
          } else {
            return false;
          }
        });
      },
      bzjSubmitForm(formName) {
        if (!/^(\d+|\d+\.\d+)$/.test(this.merchintBzjForm.cashDeposit)) {
          this.$modal.msgError('到账金额只能输入整数或小数');
          return
        }
        if (!/^\d+(\.\d{1,2})?$/.test(this.merchintBzjForm.cashDeposit)) {
          this.$modal.msgError('请输入正确的小数点后两位数字');
          return
        }
        if (this.productPicList.length === 0) {
          this.$modal.msgError('凭证必填');
          return
        }
        this.$refs[formName].validate(valid => {
          if (valid) {
            let params = {
              "storeCode": this.merchintBzjForm.storeCode,
              "cashDeposit": this.merchintBzjForm.cashDeposit,
              "certificateUrl": this.productPicList.map(item => item.response.data[0].url).join(',')
            }
            getUpdCashDeposit(params).then(response => {
              this.dialogBzjVisible = false;
              this.getList();
            });
          } else {}
        });
      },
      kdfSubmitForm(formName) {
        if (!/^(\d+|\d+\.\d+)$/.test(this.kdfForm.expressFee)) {
          this.$modal.msgError('快递费只能输入整数或小数');
          return
        }
        if (!/^\d+(\.\d{1,2})?$/.test(this.kdfForm.expressFee)) {
          this.$modal.msgError('请输入正确的小数点后两位数字');
          return
        }
        if (this.productPicKdfList.length === 0) {
          this.$modal.msgError('凭证必填');
          return
        }
        this.$refs[formName].validate(valid => {
          if (valid) {
            let params = {
              "storeCode": this.kdfForm.storeCode,
              "expressFee": this.kdfForm.expressFee,
              "remark": this.kdfForm.remark,
              "certificateUrl": this.productPicKdfList.map(item => item.response.data[0].url).join(',')
            }
            getUpdExpressFee(params).then(response => {
              this.dialogKdfVisible = false;
              this.getList();
            });
          } else {

          }
        });
      },
      dialogBzj() {
        this.dialogBzjVisible = false
      },
      dialogKdf() {
        this.dialogKdfVisible = false
      },
      // 商品详情页主图
      handlePictureCardPreviewDetails(file, fileList) {
        console.log(file, fileList);
      },
      handleRemoveDetails(file, fileList) {
        this.productPicList = fileList
      },
      handleSuccessDetails(response, file, fileList) {
        this.productPicList = fileList
      },
      // 快递费
      handlekdfPictureCardPreviewDetails(file, fileList) {
        console.log(file, fileList);
      },
      handlekdfRemoveDetails(file, fileList) {
        this.productPicKdfList = fileList
      },
      handlekdfSuccessDetails(response, file, fileList) {
        this.productPicKdfList = fileList
      },
      getListUser() {
        getSystemListUser().then(response => {
          this.systemList = response.data
        });
      },
      getProvinceLinked(parentCityCd, areaLevel, flag) {
        let list = this.form.businessEncoding && this.form.businessEncoding.split(',') ? this.form.businessEncoding
          .split(',') : []
        let params = {
          parentCityCd: parentCityCd,
          areaLevel: areaLevel
        }
        applicationCityCd(params).then(response => {
          if (flag === '1') {
            console.log(flag, 'flag1')
            this.licenseOwner.provinceList = response.data
          } else if (flag === '2') {
            this.licenseOwner.cityList = response.data
            if (list.length > 0 && list[1]) {
              let cityName = this.licenseOwner.cityList.filter(v => v.cityCd === list[1])[0].cityNm
              this.licenseOwner.cityName = cityName
              this.getProvinceLinked(list[1], '', '3')
            }
            console.log(flag, 'flag2', this.licenseOwner.cityList)
          } else if (flag === '3') {
            this.licenseOwner.countyList = response.data
            if (list.length > 0 && list[2]) {
              let counryName = this.licenseOwner.countyList.filter(v => v.cityCd === list[2])[0].cityNm
              this.licenseOwner.counryName = counryName
            }
          } else {}
          this.form.licenSeAll = this.licenseOwner.provinceName + this.licenseOwner.cityName + this.licenseOwner
            .counryName
        });
      },
      getSystemUserList() {
        getSystemUserList().then(response => {
          this.accountList = response.data
        });
      },
      merchantAccountResetForm() {
        this.merchantAccountDialogVisible = false
        this.reset();
        this.examReset()
        this.resetForm("merchantAccountForm");
      },
      merchantAccountDialogCancel() {
        this.merchantAccountDialogVisible = false
      },
      changeAccount(e) {
        let res = this.systemList.filter(v => v.userId === e)
        this.merchantAccountForm.loginUser = res[0].userName
        this.accountChoosedData.deptId = res[0].deptId
        this.accountChoosedData.userId = res[0].userId
        this.accountChoosedData.userName = res[0].userName
      },
      merchantAccountSubmitForm() {
        let params = {
          storeCode: this.merchantAccountForm.storeCode,
          sysUserId: this.accountChoosedData.userId,
          deptId: this.accountChoosedData.deptId,
          loginUser: this.accountChoosedData.userName,
        }
        getUpdUserAcctNo(params).then(response => {
          this.merchantAccountDialogVisible = false
          this.getList();
        });
      },
      handleChange(value) {
        this.form.province = value[0]
        this.form.city = value[1]
        this.form.county = value[2]
        console.log(value);
      },
      getOrderAddress() {
        getOrderAddress().then(response => {
          if (response.code == '200') {
            this.addressXz = JSON.parse(JSON.parse(response.data))
          }
        });
      },
      // 身份证正面
      handlePreviewN() {},
      handleRemoveN() {},
      beforeRemoveN() {},
      fileChange(file, fileList) {
        this.xlsFile = fileList
      },
      handle_successN(res) {
        console.log('图片上传成功')
      },
      submitUpload() {
        if (this.xlsFile.length <= 0) {
          this.$modal.msgSuccess("请先选取图片");
          return
        }
        const newArr = this.xlsFile.map(item => {
          return item.raw
        });
        let formData = new FormData();
        newArr.forEach((file, index) => {
          formData.append(`file[${index}]`, file);
        });
        uploadImages(formData).then(response => {
          if (response.code == '200') {
            this.xlsFile = []
            this.fileListN = []
            this.listNew = response.data
            this.form.legalPersonPicFront = this.listNew[0].url
          }
        });
      },
      deleteImage(index) {
        let res = this.listNew[index].url
        const data = {
          'fileName': res
        }
        fileDeleteOss(data).then(response => {
          if (response.code == '200') {
            this.listNew.splice(index, 1)
            this.$modal.msgSuccess("删除成功");
          }
        });
        this.xlsFile = [];
        this.fileListN = [];
        this.listNew = []
      },
      handleExceedN() {},
      // 身份证反面
      handlePreviewNun() {},
      handleRemoveNun() {},
      beforeRemoveNun() {},
      fileChangeun(file, fileList) {
        console.log(fileList, '============')
        this.xlsFile1 = fileList
      },
      handle_successNun(res) {
        console.log('图片上传成功')
      },
      submitUploadun() {
        if (this.xlsFile1.length <= 0) {
          this.$modal.msgSuccess("请先选取图片");
          return
        }
        const newArr = this.xlsFile1.map(item => {
          return item.raw
        });
        let formData = new FormData();
        newArr.forEach((file, index) => {
          formData.append(`file[${index}]`, file);
        });
        uploadImages(formData).then(response => {
          if (response.code == '200') {
            this.listNew1 = response.data
            this.xlsFile1 = []
            this.fileListN1 = []
            this.form.legalPersonPicReverse = this.listNew1[0].url
          }
        });
      },
      deleteImageun(index) {
        let res = this.listNew1[index].url
        const data = {
          'fileName': res
        }
        fileDeleteOss(data).then(response => {
          if (response.code == '200') {
            this.listNew1.splice(index, 1)
            this.$modal.msgSuccess("删除成功");
          }
        });

        this.xlsFile1 = [];
        this.fileListN1 = [];
        this.listNew1 = []
      },
      handleExceedNun() {},
      /** 查询店铺列表 */
      getList() {
        this.loading = true;

        let params = {
          pageNum: this.queryParams.pageNum,
          pageSize: this.queryParams.pageSize,
          storeCode: this.queryParams.storeCode,
          storeName: this.queryParams.storeName,
          keyword: this.queryParams.keyword,
          storeMold: this.queryParams.storeMold,
          legalName: this.queryParams.legalName,
          personPhone: this.queryParams.personPhone,
        }
        getOnlinestoreStoreList(this.addDateRange(params, this.dateRange, '01')).then(response => {
          this.onlinestoreList = response.data;
          this.onlinestoreList.map(v => {
            let result = v.certList.length > 0 ? v.certList[0] : []
            if (result.length > 0) {
              v.list = result.split(',')
            } else {
              v.list = []
            }
          })
          this.total = response.total;
          this.loading = false;
        });
      },
      handleClose() {
        this.examReset()
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
        this.examReset()
      },
      examReset() {
        this.merchintForm = {
          storeName: null,
          busFlag: null,
          storeFlag: null,
          bankFlag: null,
          storeRemarks: null,
          infoRemark: null
        }
        this.resetForm("merchintForm");
      },
      // 表单重置
      reset() {
        this.form = {
          storeCode: null,
          storeType: null,
          storeStatus: null,
          storeName: null,
          corporateAccount: null,
          legalName: null,
          legalPersonId: null,
          legalPersonPicFront: null,
          legalPersonPicReverse: null,
          personPhone: null,
          cashDeposit: null,
          businessScope: null,
          province: null,
          city: null,
          county: null,
          delFlag: null,
          crTime: null,
          upTime: null,
          onlineStoreField1: null,
          onlineStoreField2: null,
          onlineStoreField3: null,
          onlineStoreField4: null,
          onlineStoreField5: null
        };
        this.dateRange = []
        this.resetForm("form");
        this.xlsFile = [];
        this.fileListN = [];
        this.listNew = [];
        this.xlsFile1 = [];
        this.fileListN1 = [];
        this.listNew1 = [];
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.dateRange = []
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.storeCode)
        this.single = selection.length !== 1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.open = true;
        this.title = "添加店铺";
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        const storeCode = row.storeCode || this.ids
        getOnlinestore(storeCode).then(response => {
          this.form = response.data;
          this.formCopy = JSON.parse(JSON.stringify(this.form))
          let list = this.form.businessEncoding && this.form.businessEncoding.split(',') ? this.form
            .businessEncoding.split(',') : []
          if (list.length > 0 && list[0]) {
            let provinceName = this.licenseOwner.provinceList.filter(v => v.cityCd === list[0])[0].cityNm
            this.licenseOwner.provinceName = provinceName
            this.getProvinceLinked(list[0], '', '2')
          }
          this.open = true;
          this.title = "商家信息";
          this.viewReview = '1'
          this.listNew.push({
            url: this.form.legalPersonPicFront
          })
          this.listNew1.push({
            url: this.form.legalPersonPicReverse
          })
          this.form.provinceCityCountry = [this.form.province, this.form.city, this.form.county]
          this.merchintForm.storeName = this.form.storeName
        });
      },

      // 审核
      handleExam(row) {
        const storeCode = row.storeCode || this.ids
        getOnlinestore(storeCode).then(response => {
          this.form = response.data;
          this.formCopy = JSON.parse(JSON.stringify(this.form))
          let list = this.form.businessEncoding && this.form.businessEncoding.split(',') ? this.form
            .businessEncoding.split(',') : []
          if (list.length > 0 && list[0]) {
            let provinceName = this.licenseOwner.provinceList.filter(v => v.cityCd === list[0])[0].cityNm
            this.licenseOwner.provinceName = provinceName
            this.getProvinceLinked(list[0], '', '2')
          }
          this.open = true;
          this.title = "商家审核";
          this.viewReview = '2'
          this.listNew.push({
            url: this.form.legalPersonPicFront
          })
          this.listNew1.push({
            url: this.form.legalPersonPicReverse
          })
          this.form.provinceCityCountry = [this.form.province, this.form.city, this.form.county]
          this.merchintForm.storeName = this.form.storeName
        });
      },
      handleLink(row) {
        this.kfForm = {}
        this.kfForm = JSON.parse(JSON.stringify(row))
        this.dialogCustomerVisible = true
      },
      expressFeeEdit(row) {
        this.kdfForm = {}
        this.kdfForm = JSON.parse(JSON.stringify(row))
        this.productPicKdfList = []
        this.kdfForm.expressFee = null
        this.dialogKdfVisible = true
        // 店铺快递费用凭证列表
        let params = {
          "storeCode": this.kdfForm.storeCode,
          "logType": 0,
        }
        getExpressFeeLogList(params).then(response => {
          console.log(response.rows,'列表response.rowsresponse.rowsresponse.rows')
          let data = response.rows
          let list = data.map(v=>v.certificateUrl)
          let str = list.length > 0 ? list.join(',') : ''
          this.oldKdfPicList = str.split(',')
          console.log(this.oldKdfPicList,'newnew========================================================')
          // console.log(data,'==================-----------------------=======================')
        });
      },
      // 查看更多
      viewMore(row){
        this.$router.push("/delivery/fees/"+ row.storeCode);
      },
      handleBzj(row) {
        let list = row.certList
        let str = list.length > 0 ? list.join(',') : ''
        this.oldpicList = str.split(',')
        this.merchintBzjForm = {}
        this.merchintBzjForm = JSON.parse(JSON.stringify(row))
        this.productPicList = []
        this.merchintBzjForm.cashDeposit = null
        this.dialogBzjVisible = true
      },
      handleOpenAccount(row) {
        this.merchantAccountForm = {}
        this.merchantAccountForm = JSON.parse(JSON.stringify(row))
        this.merchantAccountDialogVisible = true
      },
      /** 提交按钮 */
      submitForm() {
        this.dialogVisible = true
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const storeCodes = row.storeCode || this.ids;
        this.$modal.confirm('是否确认删除店铺编号为"' + storeCodes + '"的数据项？').then(function() {
          return delOnlinestore(storeCodes);
        }).then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        }).catch(() => {});
      },
      /** 导出按钮操作 */
      handleExport() {
        this.download('store/onlinestore/export', {
          ...this.queryParams
        }, `onlinestore_${new Date().getTime()}.xlsx`)
      },
      // 店铺头像
      // storeAvatorPreviewList
      storeAvatorPreview() {

      },
      storeAvatorRemove(response, file, fileList) {
        this.storeAvatorPreviewList = fileList
      },
      storeAvatorSuccess(response, file, fileList) {
        this.storeAvatorPreviewList = fileList
      },

      // 商标证书
      // tradePreviewList
      tradePreview() {

      },
      tradeRemove(response, file, fileList) {
        this.tradePreviewList = fileList
      },
      tradeSuccess(response, file, fileList) {
        this.tradePreviewList = fileList
      },

      // 食品经营安全许可证
      // foodPreviewList
      foodPreview() {

      },
      foodRemove() {
        this.foodPreviewList = fileList
      },
      foodSuccess(response, file, fileList) {
        this.foodPreviewList = fileList
      },
    }
  };
</script>
<style scoped>
  .image-list {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;

    li {
      width: 150px;
      max-height: 150px;
      margin-right: 3%;
      overflow: hidden;
      position: relative;

      span {
        position: absolute;
        right: 0px;
        top: 0px;
        cursor: pointer;
      }
    }
  }

  /* 过于长的label分两行展示样式 */
  .fold_label .el-form-item__label {
    white-space: pre-line;
    text-align-last: justify;
    text-align: justify;
    margin-top: -4px;
    line-height: 25px;
    text-justify: distribute-all-lines;
  }

  /* 其他label根据宽度自动撑开 */
  .el-form-item__label {
    text-align-last: justify;
    text-align: justify;
    text-justify: distribute-all-lines;
  }

  .mesSty {
    height: 100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* align-items: center; */
  }
</style>
